<template>
  <n-modal v-model:show="showModal" preset="dialog" :show-icon="false">
    <flexform :formList="formList"></flexform>
    <template #action>
      <div class="w-full h-10 flex justify-end items-center">
        <n-button @click="doClose">取消</n-button>
        <n-button @click="handleOK" type="primary">确定</n-button>
      </div>
    </template>
  </n-modal>
</template>

<script setup name="usermanagerEdit">
import {useRoute, useRouter} from "vue-router";

const router = useRouter()
const route = useRoute()
const showModal = ref(false)
const typeflag = ref("add")
const title = ref("")
const formData = ref({})
const init = (type, item = null) => {
  if(item){
    formData.value = item
  }
  showModal.value = true
  typeflag.value = type
  switch (typeflag.value) {
    case "add":
      title.value = "新建"
      break;
    case "view":
      title.value = "详情"
      break;
    case "edit":
      title.value = "编辑"
      break;
  }
}
const doClose = () => {
  showModal.value = false
}
const reset = () => {
  console.log("重置数据")
}
// 点击确定
const handleOK = () => {
  console.log("点击确定")
  doClose()
}

// 表单配置
const formList = ref([
  {label: "姓名", key: "name", type: "input"},
  {label: "姓名", key: "name", type: "textarea"},
  {label: "姓名", key: "name", type: "select"},
])

defineExpose({init, doClose, reset})
</script>

<style scoped>

</style>